{extend name="public/common"}

{block name="style"}
<title>资源中心</title>
<link rel="stylesheet" href="/home/css/resource/index.css?v={$Think.config.version}">
{/block}

{block name="body"}
<div id="app" v-cloak>
    <div class="search-box">
        <div class="search">
            <img src="/home/images/common/search-grey.png" class="icon-search"/>
            <input type="search" v-model="search" placeholder="搜索" @search="getSearch" autocomplete="off"/>
            <img src="/home/images/common/delete.png" class="icon-delete" @click="delSearch()"/>
        </div>
    </div>
    <div class="search-list" v-show="showSearch" @click.prevent.self="closeSearch">
        <ul>
            <li v-for="item in searchList" @click="getFile(item.path)">
                <div class="file">
                    <div class="img-box">
                        <img src="/home/images/documents/doc.png" v-if="item.file_type=='doc'"/>
                        <img src="/home/images/documents/pdf.png" v-else-if="item.file_type=='pdf'"/>
                        <img src="/home/images/documents/ppt.png" v-else-if="item.file_type=='ppt'"/>
                        <img src="/home/images/documents/xls.png" v-else-if="item.file_type=='xlsx'"/>
                        <img src="/home/images/documents/zip.png" v-else-if="item.file_type=='zip'"/>
                        <img src="/home/images/documents/pic.png" v-else-if="item.file_type=='jpg' || item.file_type=='png' || item.file_type=='jpeg' || item.file_type=='gif'"/>
                        <img src="/home/images/documents/video.png" v-else-if="item.file_type=='mp4' || item.file_type=='avi'"/>
                    </div>
                    <div class="content">
                        <div class="title">
                            <span class="name">{{item.name}}</span>
                            <span class="uploader">{{item.username}}</span>

                        </div>
                        <div class="information">
                            <span class="time">{{item.create_time | timeToString('ymdhi')}}</span>
                            <span class="size">{{item.file_size}}</span>
                            <a :href="item.path">下载</a>
                        </div>
                    </div>
                </div>
            </li>
        </ul>
        <div v-if="searchList.length == 0" class="no-results">
            <p>暂无搜索到相关数据</p>
        </div>
    </div>
    <div class="list">
        <ul>
            <li v-for="item in list.file" @click="getFile(item.path)">
                <div class="file">
                    <div class="img-box">
                        <img src="/home/images/documents/doc.png" v-if="item.file_type=='doc'"/>
                        <img src="/home/images/documents/pdf.png" v-else-if="item.file_type=='pdf'"/>
                        <img src="/home/images/documents/ppt.png" v-else-if="item.file_type=='ppt'"/>
                        <img src="/home/images/documents/xls.png" v-else-if="item.file_type=='xlsx'"/>
                        <img src="/home/images/documents/zip.png" v-else-if="item.file_type=='zip'"/>
                        <img src="/home/images/documents/pic.png" v-else-if="item.file_type=='jpg' || item.file_type=='png' || item.file_type=='jpeg' || item.file_type=='gif'"/>
                        <img src="/home/images/documents/video.png" v-else-if="item.file_type=='mp4' || item.file_type=='avi'"/>
                    </div>
                    <div class="content">
                        <div class="title">
                            <span class="name">{{item.name}}</span>
                            <span class="uploader">{{item.username}}</span>

                        </div>
                        <div class="information">
                            <span class="time">{{item.create_time | timeToString('ymdhi')}}</span>
                            <span class="size">{{item.file_size}}</span>
                            <a :href="item.path">下载</a>
                        </div>
                    </div>
                </div>
            </li>
        </ul>
        <div class="empty" v-if="list.file.length == 0">
            <img class="empty-img" src="/home/images/common/empty.png" alt="">
            <p class="empty-title">暂无内容，敬请期待</p>
            <p class="empty-text">to be continued...</p>
        </div>
    </div>
    <div class="foot" v-if="user.permission == 1 || (user.permission == 2 && user.departmentid == topId) || (user.permission == 3 && folderUserid == user.userid)">
        <div @click="toUpload">添加上传</div>
    </div>
</div>
{/block}

{block name="script"}
<script>
    console.log({$list})
    console.log({$user})
    var vw = new Vue({
        el: "#app",
        data: {
            list: {$list},
            search: '',
            searchList: [],
            showSearch: false,
            folderUserid: '',
            user: {$user},
            topId: 0,
            pId: 0
        },
        created() {
            document.title = window.sessionStorage.getItem('folder');
            var hrefs = window.location.href.split('/'),
                keys = hrefs[hrefs.length - 1].split('.'),
                index = hrefs.indexOf('pid');
            this.pId = hrefs[index + 1];
            this.topId = keys[0];
        },
        methods: {
            closeSearch() {
                this.showSearch = false;
            },
            getSearch() {
                console.log(this.search)
                var _this = this;
                _this.$indicator.open({
                    text: '正在搜索中',
                    spinnerType: 'triple-bounce'
                });
                _this.$http.post('{:Url("Resource/search")}',{name:this.search},{emulateJSON:true}).then(function (res) {
                    var data = res.body;
                    console.log(data)
                    _this.$indicator.close();
                    if(data.code == 1){
                        _this.searchList = data.data;
                        _this.showSearch = true
                    }else{
                        _this.$toast({
                            message: "未搜索到相应内容",
                            duration: 1500
                        });
                    }
                }, function (res) {
                    _this.$indicator.close();
                    _this.$toast({
                        message: "搜索失败，请重试！",
                        duration: 1500
                    });
                });
            },
            delSearch() {
                this.searchList = [];
                this.search = '';
            },
            toUpload() {
                window.location.href = '/home/resource/fileupload.html';
                window.sessionStorage.setItem('folderId',this.pId);
            },
            getFile(path) {
                window.location.href = 'http://ow365.cn/?i=19298&ssl=1&furl=https://' + window.location.host + path;
            }
        }
    })
</script>
{/block}
